<template>
  <div class="hello">
   <van-divider>欢迎登录</van-divider>

<van-form @submit="onSubmit">
  <van-field
    v-model="phone"
    name="手机号"
    label="手机号"
    placeholder="手机号"
    :rules="[{ required: true, message: '请填写手机号' },
    { pattern: /^1[356789]\d{9}$/, message: '手机号格式错误' }]"
  />
  <van-field
    v-model="password"
    type="password"
    name="密码"
    label="密码"
    placeholder="密码"
    :rules="[{ required: true, message: '请填写密码' }]"
  />
  <div style="margin: 16px;">
    <van-button round block type="info" native-type="submit" @click.native="login()">提交</van-button>

  </div>
</van-form>
<van-button round block type="info" @click.native="register()" >去注册</van-button><br>
<van-button round block type="info" @click="code()">使用验证码登录</van-button>




    <!-- <mt-field label="手机号" placeholder="请输入手机号" v-model="phone"></mt-field>

<mt-field label="密码" placeholder="请输入密码" type="password" v-model="password"></mt-field>
  <mt-button type="primary" size="large" @click.native="login()">登录</mt-button>
    <mt-button type="primary" size="large" @click.native="register()">去注册</mt-button> -->
  </div>
</template>

<script>
import url from "../tools/url"
import { Toast } from 'mint-ui';
export default {
  name: 'Register',
  data () {
    return {
    phone:"",
    password:""
    }
  },
  methods:{
    // 验证码登录
    code(){
        this.$router.push("/Code")
    },
      onSubmit(){
        console.log("123")
        // var str =`phone=${this.phone}&password=${this.password}`;
        //      this.axios.post("https://bufferc.store:8443/user/loginByPassword",str)
        //      .then(res=>{
        //        console.log(res);
        //        if(res.data.code==200){
        //         // 把token存到浏览器
        //          sessionStorage.setItem("token",res.data.data.token);
        //         //  把用户信息存到vuex中
        //          this.$store.commit("save",res.data.data);
        //         // 跳转值首页
        //           this.$router.push("/");
        //        }else{
        //           Toast(res.data.message);
        //        }
        //      })

      },
      register(){
        this.$router.push("/Register")
    },
    //  登录
    login(){
        var str =`phone=${this.phone}&password=${this.password}`;
        this.axios.post(url.LOGINBYPASSWORD,str)
        .then(res=>{
            console.log(res);
            if(res.data.code==200){
                Toast(res.data.message);
                //1、 登录成功要保存用户信息到vuex
                this.$store.commit("saveInfo",res.data.data);
                // 2、返回token(用户的唯一标识符)，并将token保存到sessionStorage中
                 sessionStorage.setItem("token",res.data.data.token);
                 //3、 跳转到首页
                 this.$router.push("/")

              }else{
                 Toast(res.data.message);
             }
        })
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
